import Vue from 'vue'
import VueRouter from 'vue-router'
import store from '../store'
/**
 * 通过import 动态引入的代码。会有代码分割的功能（也就是熟称的路由懒加载）
 * 重定向，想让这个项目一进入页面就显示哪个具体指定的页面
 */
Vue.use(VueRouter)

const routes = [
  {
    path: '/',
    redirect: '/layout/readHome',
  },
  {
    path: '/login',
    name: 'login',
    meta: {
      auth: false,
      title: '登陆',
    },
    component: () =>
      import(/* webpackChunkName: "login" */ '../views/Login.vue'),
  },
  {
    path: '/darkMode',
    name: 'darkMode',
    meta: {
      auth: true,
      title: '深色模式',
    },
    component: () =>
      import(/* webpackChunkName: "darkMode" */ '../views/DarkMode.vue'),
  },
  {
    path: '/addComments/:id',
    name: 'addComments',
    meta: {
      auth: true,
      title: '评论页面',
    },
    component: () =>
      import(/* webpackChunkName: "darkMode" */ '../views/AddComments.vue'),
  },
  {
    path: '/addressList',
    name: 'addressList',
    meta: {
      auth: true,
      title: '地址列表',
    },
    component: () =>
      import(
        /* webpackChunkName: "addressList" */ '../views/address/AddressList.vue'
      ),
  },
  {
    path: '/add-edit-address',
    name: 'add-edit-address',
    meta: {
      auth: true,
      title: '地址列表',
    },
    component: () =>
      import(
        /* webpackChunkName: "addressList" */ '../views/address/add-edit-address.vue'
      ),
  },

  {
    path: '/search',
    name: 'search',
    meta: {
      auth: true,
      title: '搜索页面',
    },
    component: () =>
      import(/* webpackChunkName: "search" */ '../views/SearchPage.vue'),
  },
  {
    path: '/detail/:id',
    name: 'detail',
    meta: {
      auth: true,
      title: '详情',
    },
    component: () =>
      import(/* webpackChunkName: "detail" */ '../views/Detail.vue'),
  },
  {
    path: '/layout',
    name: 'layout',
    component: () => import('@/layouts/index.vue'),
    // 二级路由 -> path不添加 /
    children: [
      {
        path: 'bookRack',
        name: 'bookRack',
        meta: {
          auth: true,
          title: '书架',
        },
        component: () =>
          import(/* webpackChunkName: "bookRack" */ '../views/BookRack.vue'),
      },
      {
        path: 'readHome',
        name: 'readHome',
        meta: {
          auth: true,
          title: '阅读',
        },
        component: () => import('../views/ReadHome.vue'),
      },
      {
        path: 'findPage',
        name: 'findPage',
        meta: {
          auth: true,
          title: '发现',
        },
        component: () =>
          import(/* webpackChunkName: "findPage" */ '../views/FindPage.vue'),
      },
      {
        path: 'mine',
        name: 'mine',
        meta: {
          auth: true,
          title: '我的',
        },
        component: () =>
          import(/* webpackChunkName: "mine" */ '../views/Mine.vue'),
      },
    ],
  },
  // 只要匹配不到上面的路由，就匹配我这个路由
  {
    path: '*',
    component: () => import('../views/404.vue'),
  },
]

//获取原型对象上的push函数
const originalPush = VueRouter.prototype.push
//修改原型对象中的push方法
VueRouter.prototype.push = function push(location) {
  return originalPush.call(this, location).catch((err) => err)
}

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes,
})

// 导航守卫
router.beforeEach((to, from, next) => {
  if (to.meta.auth) {
    const token = store.state.token
    if (token) {
      next()
    } else {
      console.log('我是跳转----------------')
      next({
        path: '/login',
        query: { fullPath: to.fullPath },
      })
    }
  } else {
    next()
  }
})

export default router
